<?php
include_once('admin/php/includes/definer.php');
include_once('php/checkers/proyecto.checker.php');
?>
<!DOCTYPE html>
<!--[if lt IE 7]>      <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]>         <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]>         <html class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js" lang="en"> <!--<![endif]-->
    <head>
        <?php include_once('admin/php/includes/jsDefiner.php'); ?>
        <meta charset="ISO-8859-1">
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
        <title>Estudio Fuseo Arquietectos</title>
        <meta name="description" content="">
        <meta name="viewport" content="width=device-width">

        <!-- Place favicon.ico and apple-touch-icon.png in the root directory -->

        <link rel="stylesheet" href="<?php echo(URL) ?>css/normalize.css">
        <link rel="stylesheet" href="<?php echo(URL) ?>css/main.css">
        <link rel="stylesheet" href="<?php echo(URL) ?>css/bootstrap.css">
        <link rel="stylesheet" href="<?php echo(URL) ?>css/bootstrap-responsive.min.css">
        <link rel="stylesheet" href="<?php echo(URL) ?>css/style.css">
        <link rel="stylesheet" href="<?php echo(URL) ?>css/flexslider.css">
        <link href='http://fonts.googleapis.com/css?family=Archivo+Narrow:400,700' rel='stylesheet' type='text/css'>

    </head>
    <body>
        <!--[if lt IE 7]>
            <p class="chromeframe">You are using an outdated browser. <a href="http://browsehappy.com/">Upgrade your browser today</a> or <a href="http://www.google.com/chromeframe/?redirect=true">install Google Chrome Frame</a> to better experience this site.</p>
        <![endif]-->
        <!-- NAV HEADER -->
        <?php include_once('tpl//navHeader.html'); ?>
        <!-- FIN NAV HEADER -->
        <div class="row-fluid">
            <div class="span12 header-mobile visible-phone" style="margin: 15px 0px 0px">
                <div class="flechitaVolver"><a href="<?php echo(URL); ?>en-ejecucion" style="display: block;width: 100%;height: 100%"></a></div>
                <div class="tituloHeaderMobile"><p>EN EJECUCI&Oacute;N</p></div>
            </div>
        </div>
        

        <!-- PROYECTOS GRILLA-->
        <section id="proyecto" class="">

            <div id="right-side-proyecto">
                <div class="row-fluid">
                    <div class="span12">
                        <div id="sliderProyecto" class="flexslider">
                            <ul class="slides">
                                <?php include_once('php/printers/enEjecucionSlider.printer.php'); ?>                        
                            </ul>
                        </div>                        
                    </div>
                </div>
            </div>
            <div id="left-side-proyecto" class="">
                <div class="controls-wrapper">
                    <div class="boton-back-wrapper hidden-phone">
                        <a href="<?php echo(URL); ?>en-ejecucion" class="btn-volver">
                            Volver
                        </a>
                    </div>
                </div>
                <div class="info-proyecto-wrapper">
                    <?php include_once('php/printers/infoProyecto.printer.php'); ?>
                </div>
                <div class="listado-proyectos-wrapper">
                    <div class="hidden-phone">
                        <p class="titularCategoria">EN EJECUCI&Oacute;N</p>
                        <ul>
                            <?php include('php/printers/enEjecucionListado.printer.php'); ?>
                        </ul>                        
                    </div>
                    <div class="visible-phone">
                        <div class="row-fluid">
                            <div class="span12 header-mobile visible-phone" style="margin-bottom: 0px">
                                
                                <div class="tituloHeaderMobile"><p>EN EJECUCI&Oacute;N</p></div>
                            </div>
                        </div>
                        <div class="row-fluid" id="listaCategoriaMobile">
                            <div class="span12">
                                <ul>
                                    <?php include('php/printers/enEjecucionListado.printer.php'); ?>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <!-- FIN PROYECTOS GRILLA-->

        <div style="clear: both"></div>
        
        <!-- FOOTER -->
        <?php include_once('tpl/footer.html'); ?>
        <!-- FIN FOOTER -->



        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js" ></script>
        <script type="text/javascript" >window.jQuery || document.write('<script src="js/vendor/jquery-1.8.0.min.js"><\/script>')</script>
        <script type="text/javascript" src="<?php echo(URL); ?>js/plugins.js"></script>
        <script type="text/javascript" src="<?php echo(URL); ?>js/bootstrap.min.js"></script>
        <script type="text/javascript" src="<?php echo(URL); ?>js/jquery.flexslider.js"></script>
        

        <script type="text/javascript">
            $(window).load(function (){
                $('.flexslider').flexslider({
                    animation: "fade",
                    controlNav: true,               //Boolean: Create navigation for paging control of each clide? Note: Leave true for manualControls usage
                    directionNav: true,             //Boolean: Create navigation for previous/next navigation? (true/false)
                    prevText: "<",           //String: Set the text for the "previous" directionNav item
                    nextText: ">",
                    controlsContainer: '.controls-wrapper'
                });
                
                ajustarProyecto();

            });               
            
            $(window).resize(function () {
                ajustarProyecto();
            })
            function ajustarProyecto () {
                var ancho, alto;
                var anchoPantalla = $(window).width();
                //console.log(anchoPantalla)
                if(anchoPantalla > 767){
                    $('.info-proyecto-wrapper').removeClass('span12')
                    var anchoSlider = $(window).width() - $('#left-side-proyecto').width();
                    var altoSlider = $(window).height() - $('#header').height() - $('#footer').height();
                    var altoDetalles = $(window).height() - $('#header').height() - $('#footer').height();

                    $('#right-side-proyecto').width(anchoSlider)           
                    $('#right-side-proyecto').height(altoSlider)              
                    $('#left-side-proyecto').height(altoDetalles)
                    
                    $('#sliderProyecto').width(anchoSlider).height(altoSlider)
                    var anchoC = 1600;
                    var altoC = 842
                    
                    if ((anchoC / altoC) > (anchoSlider / altoSlider)) {
                        ancho = Math.round((anchoC/altoC)*altoSlider);
                        $('#sliderProyecto img').width(ancho).height(altoSlider);
                        $('#sliderProyecto img').css({left:'-'+((ancho - anchoSlider) / 2)+'px', top:0})
                    } else {
                        alto = Math.round   ((altoC/anchoC)*anchoSlider);  
                        $('#sliderProyecto img').width(anchoSlider).height(alto);
                        $('#sliderProyecto img').css({left:0, top:'-'+((alto - altoSlider) / 2)})
                    }
                    
                    
                }else{
                    $('#right-side-proyecto, #sliderProyecto').css('height', 'auto')            
                    $('#right-side-proyecto, #sliderProyecto').css('width', '100%')
                    $('.flexslider img').css({width:'100%', height:'auto', position:'relative', left:0, top:0})
                    $('.info-proyecto-wrapper').addClass('span12')
                }   
            }
        </script>
    </body>
</html>
